<template>
	<view class="container">
		<view class="name flex flex-align flex-center">{{data.title}}</view>
		<view class="id flex flex-align flex-center">
			用户ID:{{data.uuid}}
		</view>
		<view class="img flex flex-align flex-center">
			<image :src="data.logo"></image>
		</view>
		<view class="btns flex flex-align flex-center" :class="data.draw_status==1?'active':''" @click="submite">{{data.draw_status==1?'已领取':'领取'}} </view>
		<view class="id flex flex-align flex-center" v-if="data.draw_time">
			领取时间:{{data.draw_time}}
		</view>
		<view class="shequList" v-if="community_pid">
			<view class="list">
				<view class="title">我的当前自提点</view>
				<view class="mendian flex flex-bt">
					<view class="left">
						<image :src="community_pid.image" mode=""></image>
					</view>
					<view class="center ">
						<view class="titles flex flex-align flex-bt" >
							<view class="l flex flex-align">{{community_pid.community_name}}</view>
							<!-- <view class="r">距离{{community_pid.km||0.0}}公里</view> -->
						</view>
						<!-- <view class="team">团长：{{community_pid.name}}</view> -->
						<view class="team">{{community_pid.province}}{{community_pid.city}}{{community_pid.area}}{{community_pid.address}}</view>
						<!-- <view class="flex flex-align" style="margin-top: 10rpx;" @click="telClick(community_pid.phone)">
							<text class="cuIcon cuIcon-phone" style="color: #f20;"></text>
							<view class="">{{community_pid.phone}}</view>
						</view> -->
					</view>
					<!-- <view class="right" @click="openLocation(community_pid)">
						<tui-icon name="gps" color="#999" :size="28"></tui-icon>
					</view> -->
				</view>
				<view class="anbtns flex">
					<view class="flex-1 flex flex-align flex-cneter">
						团长姓名:{{community_pid.name}}
					</view>
					<view class="flex-1 flex flex-align flex-cneter" @click="bohao(community_pid.phone)">
						电话:{{community_pid.phone}}
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	
	export default {
		
		data() {
			return {
				group_uuid:'',
				qrcode_id:'',
				data:'',
				dataInfo:'',
				community_pid:''
			}
		},
		onLoad(e) {
			this.id = e.refCode
			let islogin = this.tui.isLogin()
			if(islogin){
				this.qrcode_id = e.qrcode_id
				this.group_uuid = e.group_uuid
				this.getdata()
				this.getUser()
			}else{
				uni.setStorageSync('refCode', e.refCode)
				uni.setStorageSync('qrcodeid', e.qrcode_id)
				uni.setStorageSync('groupuuid', e.group_uuid)
				uni.redirectTo({
					url: '/pages/login/login'
				})
			}
			// 使用示例
		},
		
		methods: {
			
			getdata(){
				let that = this
				that.tui.request('api.auth.qrcode/info', "post",{qrcode_id:that.qrcode_id,group_uuid:that.group_uuid}, false, false, true).then((res) => {
					if(res.code==1){
						that.data = res.data.info
					}
				}).catch((res) => {})
			},
			submite(){
				let that = this
				if(that.data.draw_status==1){
					return
				}
				that.tui.request('api.auth.qrcode/draw', "post",{qrcode_id:that.qrcode_id,group_uuid:that.group_uuid}, false, false, false).then((res) => {
					that.tui.toast(res.info)
					if(res.code==1){
						that.getdata()
					}
				}).catch((res) => {})
			},
			getUser() {
				let that = this
				that.tui.request("api.auth.center/get", "POST", {}, false, false, true).then((res) => {
					if (res.code == 1) {
						that.dataInfo = res.data
						that.order = res.data.order
						that.community_pid =res.data.community_pid
					}
				}).catch((res) => {
			
				})
			},
			bohao(e){
				if(e){
					uni.makePhoneCall({
						phoneNumber:e
					});
				}
			},
		}
	}
</script>

<style lang="scss">
	page{background: #fff;}
	.container{padding-top: 10vh;}
	.name{font-weight: bold;font-size: 32rpx;}
	.id{color: #696969;margin: 10rpx 0 50rpx;}
	.img{margin:0rpx 0 30rpx;
		image{width: 250rpx;height: 250rpx;border-radius: 100%;}
	}
	.btns{width: 500rpx;margin: 100rpx auto 30rpx;background: #fe3b0f;color: #fff;border-radius: 60rpx;height: 80rpx;}
	.btns.active{background: #ddd;}
	.shequList{background: #F5F6F7;margin: 60rpx 24rpx 0;border-radius: 20rpx;
		.list{
			.title{padding:30rpx 30rpx 0;border-bottom: 1px solid #eee;padding-bottom: 20rpx;}
			.mendian{padding:0 30rpx 30rpx;margin: 30rpx 0 0;
				.left{margin-right: 20rpx;
					image{width: 150rpx;height: 150rpx;}
				}
				.center{width:560rpx;display: flex;flex-direction:column;justify-content: space-between;
					.titles{
						.l{font-size: 30rpx;color:#323233;font-weight: bold;
							image{width: 60rpx;height: 60rpx;border-radius: 10rpx;margin-right: 10rpx;}
						}
						.r{color: #f20;}
					}
					.team{margin: 10rpx 0;color: #999;}
				}
			}
			.anbtns{padding: 0 30rpx 40rpx;
				.flex-1{background: #fff;height: 70rpx;border-radius: 70rpx;justify-content: center;color: #323233;}
				.flex-1:last-child{margin-left: 30rpx;}
			}
		}
	}
</style>
